import '../Car/Addk.css'
import { Form, Input, Select, Button, Popconfirm, Message } from '@arco-design/web-react';
import { useNavigate } from 'react-router-dom'
import { useRef } from 'react';
import carApi from '../../API/carApi';
const FormItem = Form.Item;


const Addk = () => {

  const navigate = useNavigate()
  const wk = useRef(null)

  const [conForm] = Form.useForm()
  const [neiForm] = Form.useForm()
  // 车牌号码String carNum
  // 车牌类型String carType
  // 月卡类型Integer monthcardType
  // 月卡状态Integer monthcardState
  // 黑白名单(车辆状态)String carState
  // 车主姓名String ownerName
  // 联系方式String ownerPhone
  // 停车位号String parkingPalaceNum

  const Addto = () =>{
    let value1 = conForm.getFieldsValue()
    // let value2 = neiForm.getFieldsValue()
    console.log(value1);
    carApi.getCarContent(value1).then((res)=>{
      console.log(res);
      if (res.code===200) {
        setTimeout(()=>{
          navigate('/home/car')
        },700)
        Message.info({
          content: '添加成功',
        });
      }else{
        Message.error('添加失败')
      }
    })
    // let obj = {
    //   carNum: value1.carNum ? value1.carNum : "",
    //   monthcardNum: value1.monthcardNum ? value1.monthcardNum : "",
    //   parkingPalaceNum: value2.parkingPalaceNum ? value2.parkingPalaceNum : "",
    //   monthcardType: value2.monthcardType ? value2.monthcardType : "",
    //   monthcardNum: value2.monthcardNum ? value2.monthcardNum : "",
    //   ownerName: value2.ownerName ? value2.ownerName : "",
    //   ownerPhone: value2.ownerPhone ? value2.ownerPhone : "",
    //   parkingPalaceNum: value2.parkingPalaceNum ? value2.parkingPalaceNum : "",
    // }
  }
  


  return (
    <div className='outline'>

      <Form className='from' layout='inline' form={conForm}>

        <FormItem label='车牌号码:' field='carNum'>
          <Input  className='select' placeholder='请输入' />
        </FormItem>
        <FormItem label='月卡卡号:' field='monthcardNum'>
          <Input  className='select' placeholder='请输入' />
        </FormItem>
        <FormItem label='停车位号:' field='parkingPalaceNum'>
          <Input  className='select' placeholder='请输入' />
        </FormItem>

        <FormItem label='月卡类型:' field='monthcardType'>
          <Select
            className='select'
            placeholder='请选择'
            options={[
              {
                label: '包月',
                value: 0
              },
              {
                label: '包季',
                value: 1
              },
              {
                label: '包年',
                value: 2
              },
              {
                label: '长期',
                value: 3
              },
            ]}
          />
        </FormItem>
        <FormItem label='月卡时长:' field='createDate'>
          <Select
            className='select'
            placeholder='请选择'
            options={[
              {
                label: '7天',
                value: 7
              },
              {
                label: '14天',
                value: 14
              },
              {
                label: '21天',
                value: 21
              },
              {
                label: '30天',
                value: 30
              },
            ]}
          />
        </FormItem>
        <FormItem label='自定时长:' field='selfCreateDate'>
          <Input  className='select' placeholder='请输入(天)' />
        </FormItem>

        <FormItem label='车主姓名:' field='ownerName'>
          <Input  className='select' placeholder='请输入' />
        </FormItem>
        <FormItem label='联系方式:'field='ownerPhone'>
          <Input  className='select' placeholder='请输入' />
        </FormItem>
        <FormItem label='备注信息:' field='remark'>
          <Input  className='select' placeholder='请输入' />
        </FormItem>
      </Form>


      {/* 隐藏部分 */}
      <div className='wk' ref={wk}>
        <Form className='from' layout='inline' form={neiForm}>
          <FormItem label='车牌号码:' field='carNum'>
            <Input  className='select' placeholder='请输入' />
          </FormItem>
          <FormItem label='月卡卡号:' field='monthcardNum'>
            <Input  className='select' placeholder='请输入' />
          </FormItem>
          <FormItem label='停车位号:' field='parkingPalaceNum'>
            <Input  className='select' placeholder='请输入' />
          </FormItem>

          <FormItem label='月卡类型:' field='monthcardType'>
            <Select
              className='select'
              placeholder='请选择'
              options={['跑车', 'suv', '轿车']}
            />
          </FormItem>
          <FormItem label='月卡时长:' field='monthcardNum'>
            <Select
              className='select'
              placeholder='请选择'
              options={['跑车', 'suv', '轿车']}
            />
          </FormItem>
          <FormItem label='自定时长:' field='selfCreateDate'>
            <Input  className='select' placeholder='请输入' />
          </FormItem>

          <FormItem label='车主姓名:' field='ownerName'>
            <Input  className='select' placeholder='请输入' />
          </FormItem>
          <FormItem label='联系方式:' field='ownerPhone'>
            <Input  className='select' placeholder='请输入' />
          </FormItem>
          <FormItem label='备注信息:' field='remark'>
            <Input  className='select' placeholder='请输入' />
          </FormItem>
        </Form>
      </div>


      <div className='anniu'>
        <Button
          style={{border:'1px solid #000000',color:'#000000',background:'#fff'}}
          onClick={() => { wk.current.style.height == '180px' ? wk.current.style.height = '0px' : wk.current.style.height = '180px' }}
        >
          继续添加
        </Button>

        <Popconfirm
          title='是否添加新数据'
          onOk={() => {
            Addto()
          }}
          onCancel={() => {
            Message.error({
              content: '已取消',
            });
          }}
        >
          <Button type="primary">确认添加</Button>
        </Popconfirm>

        <Button style={{color:'#165DFF',background:'#6DFCE9'}} onClick={() => navigate(-1)}>取消</Button>
      </div>



    </div>
  )
}
export default Addk;